<template>
	<view class="bank pr-30 pl-30 pt-45">
		<view class="radius-20 bg-1 pl-30 pr-30">
			<u-field v-model="from.name" label="真实姓名" label-width="180" input-align="right" placeholder="请输入您的姓名">
			</u-field>
			<u-field v-model="from.identity" label="身份证号" label-width="180" input-align="right" placeholder="请输入身份证号">
			</u-field>
			<u-field v-model="from.bank_name" label="银行" label-width="180" input-align="right" placeholder="请输入银行">
			</u-field>
			<u-field v-model="from.kai_address" label="开户行" label-width="180" input-align="right" placeholder="请输入开户行">
			</u-field>
			<u-field v-model="from.number" label="银行卡号" label-width="180" input-align="right" placeholder="请输入银行卡号">
			</u-field>
			<u-field v-model="from.mobile" label="银行预留手机号" label-width="200" :border-bottom="false" input-align="right"
				placeholder="请输入预留手机号">
			</u-field>
		</view>
		<view class="mt-50">
			<u-button class="bank-btn" hover-class="none" @click="submit">提交</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				from:{
					name:'',
					identity:'',
					bank_name:'',
					kai_address:'',
					number:'',
					mobile:''
				},
				falg:true,//
			};
		},
		methods:{
			submit () {
				if (!this.from.name) return uni.showToast({
					title:'请输入您的姓名',
					icon:'none'
				})
				if (!this.from.identity) return uni.showToast({
					title:'请输入身份证号',
					icon:'none'
				})
				if (!this.from.bank_name) return uni.showToast({
					title:'请输入银行名称',
					icon:'none'
				})
				if (!this.from.kai_address) return uni.showToast({
					title:'请输入开户行',
					icon:'none'
				})
				if (!this.from.number) return uni.showToast({
					title:'请输入银行卡号',
					icon:'none'
				})
				if (!this.from.mobile) return uni.showToast({
					title:'请输入预留手机号',
					icon:'none'
				})
				if (!this.falg) return
				this.falg = false
				this.$http('api/newapi/banks',this.from).then(res=>{
					uni.showToast({
						title:'绑定成功'
					})
					setTimeout(()=>{
						uni.navigateBack()
					},800)
				}).catch(()=>{
					this.falg = true
				})
			}
		}
	}
</script>
<style>
	page {
		background: #f5f5f5;
	}
</style>
<style lang="scss" scoped>
	.bg-1 {
		background-color: #fff;
	}
	/deep/ .u-field {
		color: #3c3c3c !important;
		font-size: 26rpx;
		padding: 30rpx 0 !important;
	}

	.bank-btn {
		color: #FFFFFF;
		font-size: 30rpx;
		line-height: 88rpx;
		height: 88rpx !important;
		background: linear-gradient(90deg, #EEA634, #DE2D32);
		border-radius: 44rpx;
	
	&::after {
			border: none;
		}
	}
</style>
